<%-- 
    Document   : scriptandqueuedemo
    Created on : Aug 22, 2012, 9:24:48 PM
    Author     : Greg Scott
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link rel="stylesheet" media="all" type="text/css" href="/resources/css/sandbox/general.css" />
        <title>Meducated - Sandbox - Script and Queue demo</title>
        <script>
            // --------------------- Some AJAX-related JS routines --------------------
            // A good compatible means of getting an http object	
            function getHTTPObject() {
                var	xmlhttp;	
                if (!xmlhttp &&	typeof XMLHttpRequest != 'undefined') {
                    try	{											   
                        xmlhttp	= new XMLHttpRequest();					   
                    } catch	(e)	{	   
                        xmlhttp	= false;
                    }					
                }						 
                return xmlhttp;
            }

            // The HTTP	object
            var	http;	
            // The recipient element of	any AJAX response
            var	destination = null;
            // Flag to indicate if an AJAX request has been sent
            var sending = false;
		
            // Respond to an AJAX response (a listener)
            function handleHttpResponse() {	
                //alert("Response received, code " + http.readyState);
                if (http.readyState == 4) {	 
                    if(http.status == 200) { // 200 = perfect    			    
                        sending = false;
                        if(destination)	{				        
                            if(destination.value) {
                                destination.value = http.responseText;
                            } 
                            else {
                                destination.innerHTML =	http.responseText;
                            }
                        }
                    }
                    else {
                        //alert("There was a problem receiving the AJAX response:\n" + http.statusText);
                        sending = false;
                    }
                }
            }

            // Sends an HTTP request and waits for a response by registering a listener
            function sendHttpRequest(url) {	
                if(sending) {
                    alert("You must wait until the previous request is completed.");
                    return false; 
                }
                else {   
                    http = getHTTPObject();
                    if(http) {	  	             	       
                        sending = true;  
                        http.onreadystatechange = handleHttpResponse;	
                        http.open("GET", url, true);  		             
                        http.send();
                        return true;	
                    }
                    else {
                        alert("Cant get HTTP object");
                        return false;
                    }	    
                }
            }
	    
            // Sends an HTTP request and sends the response to the element with the specified od
            function fireLiveContentById(elementid, url) {
                if(!sending) {
                    destination = document.getElementById(elementid);
                    sendHttpRequest(url);
                }
            }
            // ------------------------------------------------------------------------
            // Set a timeout to poll
            function getPatientObs() {
                fireLiveContentById("demopatient", "/demopatientobs");
                setTimeout(getPatientObs, 5000);
            }
            
        </script>
    </head>
    <body onLoad="setTimeout(getPatientObs, 1000); ">
        <div id="header">
            <div id="logo"></div>
        </div>

        <div id="content">
            <%
                String code;
                if ((code = request.getParameter("code")) != null) {
                    com.meducated.sandbox.scriptingandqueues.DemoStartPatientTask.start(code, (request.getParameter("restart") != null));
            %>
            <div class="resultok">New code has been inserted...</div>
            <% }
            %>
            <h1>Sandbox example</h1>
            <p>This is a simple demo of what's possible by combining Java scripting features with GAE Task queues. You can in a very simplistic way 'on the fly' change the physiology of a simulated patient.

            <h2>The state of the Demo Patient</h2>
            <p>This box shows you the state of the patient right now. This should update itself every 5 seconds or so.</p>
            <div id="demopatient" class="obsdisplay">Please wait...</div>
            <h2>How it works</h2>
            <p>Your need to enter some JavaScript. This code will be executed periodically by the 'simulator'. In this demo setup, you can access one patient, called <code>pt</code>, and within that, properties for heart rate (called <code>hr</code>) and blood pressure (accessed via <code>bp.sbp</code> and <code>bp.dbp</code>).

            <h2>Edit the current code</h2>
            <p>This box lists the currently executed code. To change the innards of your patient, enter your code in the box below and click 'Start'. This will start the patient from time zero if you tick the box.
            <form method="get" action="">
                <textarea class="code" name="code" rows="10" cols="80"><%= com.meducated.sandbox.scriptingandqueues.DemoStartPatientTask.getCode()%></textarea>
                <button type="submit" class="start">Start</button>
                <input type="checkbox" name="restart">Reset the clock
            </form>

            <h2>Confused? Try copy/pasting these examples</h2>
            <h3>Example 1</h3>
            <pre>// Set the heart rate and BP of the patient to something realistic
pt.hr = 70;
pt.bp.sbp = 120;
pt.bp.dbp = 80;</pre>

            <p>If you are getting really clever, you can use the property of the patient <code>clock</code>, which tells you the number of seconds passed since the patient was 'created'. This enables you to bring about changes as a function of time.
            <h3>Example 2</h3>
            <pre>// Set the heart rate and BP of the patient to something realistic
if(pt.clock < 60) {
    pt.hr = 70;
    pt.bp.sbp = 120;
    pt.bp.dbp = 80;
}
else {
    pt.hr = 180;
    pt.bp.sbp = 60;
    pt.bp.dbp = 20;
}
            </pre>       





        </div>
    </body>
</html>
